<div class="row" style="padding: 50px 0;">
  <div class="col-md-3"></div>
  <div class="col-md-6">
    <div class="card">
      <div class="card-body">
        <div class="card-title">Sign in to <%= @pre_auth.client.name %></div>
        <p>
          Application <strong class="text-danger"><%= @pre_auth.client.name %></strong> wants you to authorize your account to login.
        </p>

        <% if @pre_auth.scopes %>
          <div id="oauth-permissions">
            <p><%= t('.able_to') %>:</p>

            <ul class="list-group" style="font-weight: bold;">
              <% @pre_auth.scopes.each do |scope| %>
                <li class="list-group-item"><%= t scope, scope: [:doorkeeper, :scopes] %></li>
              <% end %>
            </ul>
          </div>
        <% end %>

        <div class="actions flex mt-4 mb-2 gap-2 items-center">
          <%= form_tag oauth_authorization_path, class: "col-md-6", style: "margin-bottom: 0", method: :post do %>
            <%= hidden_field_tag :client_id, @pre_auth.client.uid %>
            <%= hidden_field_tag :redirect_uri, @pre_auth.redirect_uri %>
            <%= hidden_field_tag :state, @pre_auth.state %>
            <%= hidden_field_tag :response_type, @pre_auth.response_type %>
            <%= hidden_field_tag :scope, @pre_auth.scope %>
            <%= submit_tag t('doorkeeper.authorizations.buttons.authorize'), class: "btn btn-primary btn-block" %>
          <% end %>

          <%= form_tag oauth_authorization_path, class: "col-md-6", style: "margin-bottom: 0", method: :delete do %>
            <%= hidden_field_tag :client_id, @pre_auth.client.uid %>
            <%= hidden_field_tag :redirect_uri, @pre_auth.redirect_uri %>
            <%= hidden_field_tag :state, @pre_auth.state %>
            <%= hidden_field_tag :response_type, @pre_auth.response_type %>
            <%= hidden_field_tag :scope, @pre_auth.scope %>
            <%= submit_tag t('doorkeeper.authorizations.buttons.deny'), class: "btn btn-danger btn-block" %>
          <% end %>
        </div>
      </div>
    </div>

  </div>
</div>
